<!--  预算财年-->
<template>
  <a-card :bordered='false'>
    <!-- 查询区域 -->
    <search ref='search' :config='searchConfig' @search='search' @getHeight='getHeight' />

    <!-- table区域-begin -->
    <div class='page_table'>
      <vxe-grid
        ref='xGrid'
        v-bind='vexConfig'
        :align='left'
        :border='true'
        :checkbox-config='checkboxConfig'
        :columns='columns'
        :data='dataSource'
        :height='pageHeight-seachHeight-94'
        :loading='loading'
        :resizable='true'
        :showOverflow='true'
        :toolbar-config='tableToolbar'
        size='mini'
        @checkbox-change='selectChangeEvent'
        @checkbox-all='selectChangeEvent'
      >
        <template #toolbar_buttons>
          <!-- 操作按钮区域 -->
          <div class='table-operator'>
            <a-button type='primary' @click='handleAdd'>新增</a-button>
            <a-button type='primary' @click='batchDel'>删除</a-button>
            <a-button type='primary' @click="downExportXls('tpm_budget_fee_order_service')">导出</a-button>
          </div>
        </template>
        <template #orderCode='{ row,rowIndex }'>
          <a @click='handleDetail(row)'>{{ row.orderCode }}</a>
        </template>
        <template #status='{ row }'>
          <p>{{row.status == 1 ? "启用" : "停用"}}</p>
        </template>
        <template #action='{ row:record }'>
          <a @click="handleEdit(record)">编辑</a>
        </template>

        <template #pager>
          <vxe-pager
            :currentPage.sync='ipagination.current'
            :layouts="['Total', 'PrevJump', 'PrevPage', 'Number', 'NextPage', 'NextJump','Sizes', 'FullJump']"
            :page-size.sync='ipagination.pageSize'
            :pageSizes='ipagination.pageSizeOptions'
            :total='ipagination.total'
            @page-change='handlePageChange'>
          </vxe-pager>
        </template>
      </vxe-grid>
    </div>
    <!-- table区域-end -->

    <new-order-fee ref='modalForm'  @ok='modalFormOk'></new-order-fee>
    <business-log ref="businessLog"></business-log>
  </a-card>

</template>

<script>
import { PageListMixin } from '@/mixins/PageListMixin'
import { getAction, postAction } from '@api/manage'
import newOrderFee from './model/newOrderFee'
import JEllipsis from '@/components/cn-form/JEllipsis'

export default {
  name: 'tmrBudgetYear',
  mixins: [PageListMixin],
  components: {
    JEllipsis,newOrderFee
  },
  data() {
    return {
      description: '预算订单页面',
      searchConfig: [
        {
          type: 'input',
          name: 'orderCode',
          option: [],
          placeholder: '订单编码'
        },
        {
          type: 'input',
          name: 'custCode',
          option: [],
          placeholder: '客户编码'
        },
        {
          type: 'input',
          name: 'custName',
          option: [],
          placeholder: '客户名称'
        },
        {
          // label:'售达方编码',
          type: 'date-range',
          name: 'kunnr',
          range: ['startDate', 'endDate'],// 后台接受字段
          placeholder: ['开始时间', '结束时间']
        },
      ],
      // 表头
      columns: [
        { type: 'checkbox', width: 50, fixed: null ,field: 'a',},
        {
          title: '订单编码',
          minWidth: 80,
          field: 'orderCode',
          slots: { default: 'orderCode' },
        },
        {
          title: '下单时间',
          minWidth: 120,
          field: 'orderTime'
        },
        {
          title: '经销商编码',
          minWidth: 100,
          field: 'custCode',
        },
        {
          title: '客户名称',
          minWidth: 80,
          field: 'custName',
        },
        {
          title: '客户组织编码',
          minWidth: 120,
          field: 'custOrgCode',
        },
        {
          title: '客户组织名称',
          minWidth: 120,
          field: 'custOrgName',
        },
        {
          title: '产品层级',
          minWidth: 80,
          field: 'productLevelCode',
        },
        {
          title: '产品层级名称',
          minWidth: 120,
          field: 'productLevelName',
        },
        {
          title: '产品编号',
          minWidth: 80,
          field: 'productCode',
        },
        {
          title: '产品名称',
          minWidth: 80,
          field: 'productName',
        },
        // {
        //   title: '销量(吨)',
        //   minWidth:80,
        //   field: 'salesVolume',
        // },
        {
          title: '下单金额',
          minWidth:80,
          field: 'orderAmount',
        },
        {
          title: '随车带走金额',
          minWidth:120,
          field: 'giftAmount',
        },
        {
          title: '操作',
          field: 'action',
          minWidth:120,
          fixed: 'right',
          slots: { default: 'action' },
        }
      ],
      yearOp: [],
      quarterOp: [],
      monthOp: [],
      url: {
        // 列表接口
        list: window._CONFIG['domianTpmURL'] + '/budget/tpmBudgetFeeOrder/findPageList',
        // 删除接口
        deleteBatch: window._CONFIG['domianTpmURL'] + '/budget/tpmBudgetFeeOrder/deleteBatch',
        // 详情接口
        detail: window._CONFIG['domianTpmURL']+ "/budget/tpmBudgetFeeOrder/getInfo",
      }
    }
  },
  created() {
    // // 生成预算年度
    // // let nowYear=new Date().getFullYear()
    // // let op=[]
    // // for (let i=0;i<=10;i++){
    // //   op.push({name:nowYear+i,value:nowYear+i+''})
    // // }
    // // this.yearOp=op
    // // this.searchConfig[0].option=op
    //
    // let quarter = [
    //   {
    //     name: '一季度',
    //     value: '1'
    //   },
    //   {
    //     name: '二季度',
    //     value: '2'
    //   },
    //   {
    //     name: '三季度',
    //     value: '3'
    //   },
    //   {
    //     name: '四季度',
    //     value: '4'
    //   }
    // ]
    // this.quarterOp = quarter
    // this.searchConfig[1].option = quarter
    // // 生成预算月度
    // let month = [
    //   {
    //     name: '01',
    //     value: '01'
    //   }, {
    //     name: '02',
    //     value: '02'
    //   }, {
    //     name: '03',
    //     value: '03'
    //   }, {
    //     name: '04',
    //     value: '04'
    //   }, {
    //     name: '05',
    //     value: '05'
    //   }, {
    //     name: '06',
    //     value: '06'
    //   }, {
    //     name: '07',
    //     value: '07'
    //   }, {
    //     name: '08',
    //     value: '08'
    //   }, {
    //     name: '09',
    //     value: '09'
    //   }, {
    //     name: '10',
    //     value: '10'
    //   }, {
    //     name: '11',
    //     value: '11'
    //   }, {
    //     name: '12',
    //     value: '12'
    //   }]
    // this.monthOp = month
    // this.searchConfig[2].option = month
  },
  watch: {},
  computed: {
    // importExcelUrl: function(){
    //   return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
    // }
  },
  methods: {

    handleQuarter(e) {
      this.$refs.popupForm.config.list[2].option = this.monthOp
      this.$refs.popupForm.form.resetFields(['date'])
      this.$refs.popupForm.model.stratDate = ''
      this.$refs.popupForm.model.endDate = ''
    },
    handlePageChange(page, pageSize) {
      this.ipagination.current = page
      this.loadData()
    },
    handleSizeChange(current, size) {
      this.ipagination.pageSize = size
      this.loadData()
    }
  }
}
</script>

<style lang='less' scoped>
@import '~@assets/less/common.less';

/deep/ .ant-pagination {
  float: right;
}

///deep/ .resize-table-th {
//  position: relative;
//}
///deep/ .table-draggable-handle {
//  height: 100% !important;
//  bottom: 0;
//  left: auto !important;
//  right: -5px;
//  cursor: col-resize;
//  touch-action: none;
//}

</style>